import Vue from 'vue'
import Vuex from 'vuex'
import mine from "@/store/mine";

Vue.use(Vuex)

export default new Vuex.Store({

  // vueX中存放的数据 相当于组件中的data
  state: {
    msg: '这是vueX存放的MSG',
    stateObj: {
      age: 20
    },
    count: 50,
    mineNum:666
  },
  // 对state中的数据进行初加工，相当于计算属性computed，会对数据进行缓存，但是不会改变state中的数据，会产生新的数据
  getters: {
    getCount(state) {
      console.log(state, 'state')
      return state.count
    },
    getMsg(state) {
      console.log(state, 'stateMsg')
    }
  },
  // 更改vueX中store数据的唯一方法 必须是同步的
  mutations: {
    // payload:传过来的参数
    setCount(state, payload) {
      console.log(state, 'mutations中的state')
      console.log(payload, 'mutations中的payload')
      // state.count=payload
      // state.count=payload.abc
      // state.count=payload[0]
      // state.count = payload.abc
      state.count = payload
    },
    setMsgMu(state, payload) {
      console.log(state, 'setMsgMu中的state')
      console.log(payload, 'setMsgMu中的payload')
      state.msg = payload
    },
    setMineNum(state, payload){
      console.log(state,'index setMineNum的state')
      console.log(payload,'index setMineNum的payload')
      state.mineNum = payload
    }
  },
  // 可以异步修改state中的数据 需要依赖mutations
  actions: {
    // context：上下文环境  payload：传过来的参数
    setMsg(context, payload) {
      console.log(context, 'setMsg的content')
      console.log(payload, 'setMsg的payload')
      setTimeout(() => {
        // context.commit('setMsgMu', payload.msgNew)
        context.commit('setMsgMu', payload)
      }, 1000)
    }
  },
  modules: {
    mine
  }
})